import { Drawer, Button } from 'antd';
import {SystemResourceTree} from '@/components/system/resource'
import {useEffect} from 'react';
import { connect } from 'umi';

const SystemDeptAuth = (props) => {
  const {
    SystemDeptModel: { resourceIdList, authVisible, selectData },
    dispatch,
  } = props;

  useEffect( () => {
    dispatch({ type: 'SystemDeptModel/listAclEffect' });
  }, []);

  const onClose = () => {
    dispatch({ type: 'SystemDeptModel/changeAuthVisibleReducer', payload: false });
  }

  const handleAuth = async () => {
    dispatch({ type: 'SystemDeptModel/authEffect'});
    onClose();
  }

  const handleResourceId = (d) => {
    dispatch({ type: 'SystemDeptModel/resourceIdListReducer', payload: d });
  }

  return (
    <Drawer
      title={selectData? selectData.name + ' 机构授权' : '机构授权'}
      placement="right"
      visible={authVisible}
      onClose={onClose}
      width={350}
      footer={
        <Button type="primary" block onClick={() => handleAuth()}> 授 &nbsp;&nbsp;&nbsp;&nbsp; 权 </Button>
      }
    >
      <SystemResourceTree 
        resourceIdList={resourceIdList} 
        checkResourceIdList={handleResourceId}
      />
    </Drawer>
  );
}

export default connect(({ SystemDeptModel, loading }) => ({
  SystemDeptModel,
  loading: loading.models.SystemDeptModel,
}))(SystemDeptAuth);
